<oem-drawer>
  <oem-drawer-popup hidden>
    <oem-drawer-popup-wrap>
      <div class="content">
        <form id="pc_search_form" action="/search" onsubmit="return oemsaasSearch('.search_txt')">
          <div class="relative flex items-center flex-1 input_wrap">
            <input type="text" class="search_txt" placeholder="{{search_text}}"/>
            <button type="submit">
              {% include 'svg',svg: 'search_icon' %}
            </button>
          </div>

          <div class="close_search cursor-pointer flex justify-center items-center">
            {% include 'svg',svg: 'close_icon' %}
          </div>


        </form>
      </div>
    </oem-drawer-popup-wrap>
    <oem-drawer-popup-mask></oem-drawer-popup-mask>
  </oem-drawer-popup>
</oem-drawer>

<script>
  $(function() {
    $('.search_box').on('click', function(e) {
      e.stopPropagation();
      $('oem-drawer').find('oem-drawer-popup').removeAttr('hidden')
    })
    $('oem-drawer-popup-mask').on('click', function(e) {
      e.stopPropagation();
      $(this).parent('oem-drawer-popup').attr('hidden', '')
    })
    $('oem-drawer-popup-wrap .close_search').on('click', function(e) {
      e.stopPropagation();
      $('oem-drawer-popup').attr('hidden', 'hidden')
    })
  })
</script>